<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>

<!DOCTYPE html>
<html lang="zh-CN">
<tags:header></tags:header>

<body>
	<tags:navbar></tags:navbar>
	<div class="container-fluid">
		<div class="row-fluid">
			<tags:menu></tags:menu>
			<noscript>
				<div class="alert alert-block span10">
					<h4 class="alert-heading">Warning!</h4>
					<p>
						You need to have <a href="http://en.wikipedia.org/wiki/JavaScript"
							target="_blank">JavaScript</a> enabled to use this site.
					</p>
				</div>
			</noscript>

			<div id="content" class="span10">
				<div class="row-fluid sortable">
					<div class="box span12">
						<div class="box-header well" data-original-title>
							<h2>任务</h2>

						</div>
						<div class="box-content">
							<table
								class="table table-striped table-bordered bootstrap-datatable datatable">
								<thead>
									<tr>
										<th>ID</th>
										<th>Name</th>
										<th>Status</th>
										<th>Actions</th>
									</tr>
								</thead>
								<tbody>
									<c:forEach var="item" items="${systemTriggers}">
									<tr id="trigger_${item.id}">
										<td>${item.id}</td>
										<td class="center">${item.name }</td>
										<td class="center">
											<c:if test="${item.flag}">
												<span id="label_${item.id}" class="label label-success">Active</span>
											</c:if>
											<c:if test="${!item.flag}">
												<span id="label_${item.id}" class="label">Inactive</span>
											</c:if>
										</td>
										<td class="center">
											<a id="start${item.id}" class="btn btn-danger" href="#"> 
												<i class="icon-play icon-white"></i> start
											</a>
											<a id="stop${item.id}" class="btn btn-info" href="#"> 
												<i class="icon-stop icon-white"></i> stop
											</a>
										</td>
									</tr>
									</c:forEach>
								</tbody>
							</table>
						</div>
					</div>
				</div>

				<!-- content ends -->
			</div>
			<!--/#content.span10-->
		</div>
		<!--/fluid-row-->
		<hr>
		<tags:footer></tags:footer>

	</div>
	<!--/.fluid-container-->

	<tags:footer_scripts></tags:footer_scripts>
	<script>
		$(function() {
			$("a[id^='start']").on('click', function(e) {
				e.preventDefault(); // preventing default click action
				var trid = $(this).closest('tr').attr('id'); // table row ID 
				var str = trid.split("_");
				$.ajax({
					url : '/admin/task/'+ str[1] +'/start',
					type : 'get',
					success : function() {
						// ajax callback
						$("#label_" + str[1]).addClass("label-success");
						$("#label_" + str[1]).html("Active");
					},
					error : function() {
						alert('ajax failed');
					},
				})
			})
			$("a[id^='stop']").on('click', function(e) {
				e.preventDefault(); // preventing default click action
				var trid = $(this).closest('tr').attr('id'); // table row ID 
				var str = trid.split("_");
				$.ajax({
					url : '/admin/task/'+ str[1] +'/stop',
					type : 'get',
					success : function() {
						// ajax callback
						$("#label_" + str[1]).removeClass("label-success")
						$("#label_" + str[1]).html("Inactive");
					},
					error : function() {
						alert('ajax failed');
					},
				})
			})
		})
	</script>
</body>
</html>
